<template>
  <BasicTable
    @register="registerTable"
  >
    <template #form-custom></template>
    <!--    <template v-if="checkedKeys.length > 0" #headerTop>
          <a-alert type="info" show-icon>
            <template #message>
              <template >
                <span>已选中{{ checkedKeys.length }}条记录(可跨页)</span>
                <a-button type="link" @click="checkedKeys = []" size="small">清空</a-button>
              </template>

            </template>
          </a-alert>
        </template>-->
    <template #toolbar>
      <a-button type="primary" @click="handleCreate"> 新增</a-button>
    </template>
    <template #action="{ record }">
      <TableAction
        :actions="[
            {
              icon: 'clarity:note-edit-line',
              onClick: handleEdit.bind(null, record),
            },
            {
              icon: 'ant-design:delete-outlined',
              color: 'error',
              popConfirm: {
                title: '是否确认删除',
                confirm: handleDelete.bind(null, record),
              },
            },
          ]"
      />
    </template>
  </BasicTable>
  <!--注册drawer  -->
  <SysTenantDrawer @register="registerDrawer" @success="handleSuccess"/>
</template>
<script lang="ts" setup>
import {defineComponent, ref, onMounted} from 'vue';
import {BasicTable, useTable, TableAction} from '/@/components/Table';
import {getBasicColumns, getFormConfig} from './sysTenantTableData';
//左侧拉板
import {useDrawer} from '/@/components/Drawer';

import {message} from 'ant-design-vue';
import {
  getSysTenantByIdApi,
  getSysTenantListApi,
  sysTenantDelByIdApi
} from "/@/api/sys/sysTenantApi";
import SysTenantDrawer from "/@/views/sys/tenant/sysTenantDrawer.vue";

const [registerDrawer, {openDrawer}] = useDrawer();
const checkedKeys = ref<Array<string | number>>([]);

const [registerTable, {reload, getForm, setTableData, setPagination, setLoading}] = useTable({
  title: '租户管理',
  columns: getBasicColumns(),
  useSearchForm: true,
  formConfig: getFormConfig(),
  showTableSetting: true,
  rowKey: 'id',
  bordered: true,
  showIndexColumn: true,
  actionColumn: {
    width: 80,
    title: '操作',
    dataIndex: 'action',
    slots: {customRender: 'action'},
  },
  api: getSysTenantListApi,
  fetchSetting: {
    pageField: 'current',
    // 每页显示多少条
    sizeField: 'pageSize',
    // 请求结果列表字段  支持 a.b.c
    listField: 'records',
    totalField: 'total',

  },
});

function handleCreate() {
  openDrawer(true, {
    isUpdate: false,
  });
}

async function handleEdit(record: Recordable) {
  const data = await getSysTenantByIdApi(record.id);
  openDrawer(true, {
    data,
    isUpdate: true,
  });
}

async function handleDelete(record: Recordable) {
  await sysTenantDelByIdApi(record.id);
  reload();
  message.success('删除成功');
}

function handleSuccess() {
  reload();
}

onMounted(() => {
});


</script>
